<template>
	<view class="page-index" v-if="loading">
		<view class="title-box">
			{{info.title}}
		</view>
		<view class="type-box">
			已认证
		</view>
		<view class="image-box">
			<image :src="'https://yunchenbucket.oss-cn-qingdao.aliyuncs.com/'+info.identityZ" class="item-img"  mode=""></image>
			<image :src="'https://yunchenbucket.oss-cn-qingdao.aliyuncs.com/'+info.identityF" class="item-img" mode=""></image>
		</view>
		<view class="title-box">
			店铺地址
		</view>
		<view class="address-box">
			<view class="icon">
				<image src="../../../../static/index/dizhi.png" class="icon-img" mode=""></image>
			</view>
			<view class="text">
				{{info.jyfw}}
			</view>
		</view>
		<view class="title-box">
			店铺介绍
		</view>
		<view class="details-box">
			{{info.jyfw}}
		</view>
		<view class="title-box">
			工商信息
		</view>
		<view class="item-box">
			<view class="name-box">公司全称</view>
			<view class="text">{{info.gsqc}}</view>
		</view>
		<view class="item-box">
			<view class="name-box">企业法人</view>
			<view class="text">{{info.qyfr}}</view>
		</view>
		<view class="item-box">
			<view class="name-box">注册资本</view>
			<view class="text">{{info.zczb}}</view>
		</view>
		<view class="item-box">
			<view class="name-box">成立时间</view>
			<view class="text">{{info.clsj}}</view>
		</view>
		<view class="item-box">
			<view class="name-box">信用代码</view>
			<view class="text">{{info.xydm}}</view>
		</view>
		<view class="item-box">
			<view class="name-box">营业状态</view>
			<view class="text">{{info.jyfw}}</view>
		</view>
		<view class="item-box">
			<view class="name-box">公司官网</view>
			<view class="text">{{info.gsgw}}</view>
		</view>
		<view class="item-box">
			<view class="name-box">注册地址</view>
			<view class="text">{{info.zcdz}}</view>
		</view>
		<view class="item-box">
			<view class="name-box">经营范围</view>
			<view class="text">{{info.jyfw}}</view>
		</view>
		<view class="bnt-box">
			<view class="bnt">
				<view class="icon">
					<image class="icon-img" src="../../../../static/tabbar/tabber4.png" mode=""></image>
				</view>
				<view class="" style="margin-left: 15rpx;" @click="location()">
					开始导航
				</view>
			</view>
		</view>
	</view>
</template>

<script>
	import * as index from '@/api/index.js'
	export default {
		data(){
			return{
				loading:false,
				id:'',
				info:{}
			}
		},
		onLoad(params) {
			if(params.id) {
				this.id = params.id
				this.getInfo()
			}
		},
		methods:{
			// 获取商户信息
			getInfo() {
				index.merchantInfo({id:this.id}).then(res=>{
					console.log(res)
					this.info = res.merchant
					this.loading = true
				})
			},
			location(){
				uni.openLocation({
					latitude: Number(this.info.latitude),
					longitude: Number(this.info.longitude),
					success: function () {
						console.log('success');
					}
				});
			}
		}
	}
</script>

<style scoped lang="scss">
	.page-index {
		min-height: 100%;
		background: #FFFFFF;
		position: relative;
		padding: 30rpx 41rpx 230rpx 30rpx;
		.title-box {
			font-size: 37rpx;
			font-family: Microsoft YaHei;
			font-weight: 400;
			color: #000000;
		}
		.type-box {
			margin-top: 40rpx;
		}
		.image-box {
			display: flex;
			justify-content: space-between;
			padding: 30rpx 10rpx 50rpx 10rpx;
			.item-img {
				width: 295rpx;
				height: 162rpx;
				background: #E55353;
				border-radius: 19rpx;
			}
		}
		.address-box {
			margin-top: 40rpx;
			margin-bottom: 40rpx;
			display: flex;
			align-items: center;
			.icon {
				width: 40rpx;
				height: 40rpx;
				flex-shrink: 0;
				.icon-img {
					width: 100%;
					height: 100%;
				}
			}
			.text {
				margin-left: 10rpx;
				font-size: 25rpx;
				font-family: Microsoft YaHei;
				font-weight: 400;
				color: #353535;
			}
		}
		.details-box {
			margin-top: 40rpx;
			margin-bottom: 80rpx;
			font-size: 26rpx;
			font-family: Microsoft YaHei;
			font-weight: 400;
			color: #353535;
			line-height: 42rpx;
		}
		.item-box {
			margin-top: 30rpx;
			display: flex;
			align-items: center;
			.name-box {
				font-size: 26rpx;
				font-family: Microsoft YaHei;
				font-weight: 400;
				color: #353535;
			}
			.text {
				margin-left: 50rpx;
				width: 500rpx;
				font-size: 26rpx;
				font-family: Microsoft YaHei;
				font-weight: 400;
				color: #353535;
			}
		}
		.bnt-box {
			position: fixed;
			bottom: 0rpx;
			left: 0;
			width: 750rpx;
			height: 160rpx;
			display: flex;
			justify-content: center;
			background-color: #FFFFFF;
			.bnt {
				width: 430rpx;
				height: 90rpx;
				background-color: #1b6cfc;
				display: flex;
				align-items: center;
				justify-content: center;
				color: #ffffff;
				font-size: 28rpx;
				font-weight: bold;
				border-radius: 45rpx;
				.icon {
					width: 40rpx;
					height: 40rpx;
					.icon-img {
						width: 100%;
						height: 100%;
					}
				}
			}
		}
	}
</style>
